

<include file="public@header" />
</head>
<body>
<div class="wrap js-check-wrap">
    <ul class="nav nav-tabs">
        <li class="active"><a href="{:url('banner/index')}">全部图片</a></li>
        <li><a href="{:url('banner/add')}">添加图片</a></li>
    </ul>

<!--    <form class="well form-inline margin-top-20" method="get" >-->

<!--        用户名:-->
<!--        <input type="text" class="form-control" name="user_login" style="width: 120px;"  placeholder="请输入用户名">-->

<!--        邮箱:-->
<!--        <input type="text" class="form-control" name="user_email" style="width: 120px;"   placeholder="请输入邮箱">-->

<!--        时间:-->
<!--        <input type="text" class="form-control js-bootstrap-datetime" name="start_time"-->
<!--               value="{$start_time|default=''}"-->
<!--               style="width: 140px;" autocomplete="off">-->

<!--        分类:-->
<!--        <select class="form-control" name="category" id="category" style="width: 140px;">-->
<!--            <option value='0'>全部</option>-->
<!--            <option value='1'>分类1</option>-->

<!--        </select> &nbsp;&nbsp;-->

<!--        <input type="button" id="selectval" class="btn btn-primary" value="搜索" />-->


<!--        <a class="btn btn-danger" href="{:url('test/index')}">清空</a>-->
<!--    </form>-->

    <table class="table table-hover table-bordered">

        <table class="layui-hide" id="test" lay-filter="test"></table>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
<!--                <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>-->
<!--                <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>-->
<!--                <button class="layui-btn layui-btn-sm" >幻灯片</button>-->
            </div>
        </script>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>

        <!--    自定义    -->
        <script type="text/html" id="titleTpl">
            {{#  if(d.status == 1){ }}
            显示
            {{#  } else { }}
            隐藏
            {{#  } }}
        </script>

        <script type="text/html" id="titleTpl1">
            <a href="{{d.image}}" target="_blank" ><img src="{{d.image}}" width="32" height="32" alt="" srcset=""></a>
        </script>


        <script>



            layui.use('table', function(){
                var table = layui.table;
                var curl="{:url('banner/index')}";

                var tableIns =table.render({
                    elem: '#test' ,
                    url:curl,
                    method: 'post',
                    toolbar: '#toolbarDemo',
                    title: '用户数据表',
                    // totalRow: true ,
                    cols: [[

                        {field:'id', title:'ID', width:80, fixed: 'left'}
                        ,{field:'title', title:'名称'}
                        ,{field:'link', title:'链接'}
                        ,{field:'image', title:'图片', templet: '#titleTpl1'}
                        ,{field:'status', title:'状态', templet: '#titleTpl'}
                        ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
                    ]]
                    ,page: true
                });


                $("#selectval").click(function (){

                    var time=$(".js-bootstrap-datetime").val();

                    var category=$("#category").val();

                    console.log(category);

                    tableIns.reload({
                        where: { aaaaaa: 'xxx' ,bbb: 'yyy' } ,
                        page: { curr: 1  }
                    });

                })



                //顶部工具栏事件
                table.on('toolbar(test)', function(obj){
                    var checkStatus = table.checkStatus(obj.config.id);
                    switch(obj.event){
                        case 'getCheckData':
                            var data = checkStatus.data;
                            layer.alert(JSON.stringify(data));
                            break;
                        case 'getCheckLength':
                            var data = checkStatus.data;
                            layer.msg('选中了：'+ data.length + ' 个');
                            break;
                        case 'isAll':
                            layer.msg(checkStatus.isAll ? '全选': '未全选')
                            break;
                    };
                });


                //表格工具行事件
                table.on('tool(test)', function(obj){
                    var data = obj.data;

                    if(obj.event === 'del'){
                        layer.confirm('真的删除行么', function(index){

                            $.ajax({
                                url:'delete',
                                data:{'id':data.id},
                                type:'post',
                                success:function (ret){

                                    layer.msg(ret.msg)
                                    obj.del();
                                    layer.close(index);
                                }
                            })


                        });
                    } else if(obj.event === 'edit'){

                        var curl='edit?id='+data.id


                        console.log(curl);
                        location.href=curl;

                    }
                });


            });
        </script>


    </table>

</div>
<script src="__STATIC__/js/admin.js"></script>
</body>
</html>